﻿
@inherits Ogdi.InteractiveSdk.Mvc.OgdiWebViewPage<Ogdi.InteractiveSdk.Mvc.Models.Comments.CommentInfo>

@using Ogdi.InteractiveSdk.Mvc

@{ String link = Ogdi.Azure.Configuration.OgdiConfiguration.GetValue("serviceUri") + "Comments" + "/";
link += "?$filter=" + "DatasetId eq '" + Model.DatasetId + "' and PartitionKey eq '" + Model.Container + "'"; }

<link rel="alternate" type="application/atom+xml" title="Atom" href="@link" />

<script type="text/javascript">

	function Comments() { }
	Comments.vpath = '@this.ResolveUrl("~/")';
	Comments.months = ["Jan", "Feb", "Mar", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];


	function renderDate(date) { return Comments.months[date.getMonth()] + ""; }

	function showCaptcha() {
	  Recaptcha.create('@Ogdi.Azure.Configuration.OgdiConfiguration.GetValue("RecaptchaPupblicKey")', 'eidCommentsRecaptcha', RecaptchaOptions);
	}

	$().ready(function() {
	  showCaptcha();
	  function isEmailRequired(element) {
		  return $("#eidCommentNotify")[0].checked || ($("#eidCommentType").val() == "@SharedResources.Comments.GeneralCommentNoReplyRequired");
	  }
	  $("#commentForm").validate({
		  rules: {
			CommentUserName: "required",
			CommentSubject: "required",
			CommentBody: "required",
			  CommentEmail: {
				required: { depends: isEmailRequired },
				email: true
			  }
		  }});
	});

	Comments.AddComment = function() {
	  if ($("#eidCommentsRecaptcha div").length == 0) {
		showCaptcha();
		$("#eidCaptchaMessage").empty();
		return;
	  }

	  if (!$("#commentForm").valid()) {
		  $("#eidCaptchaMessage").text("@SharedResources.Comments.PleaseFillAllFieldsCorrectly");
		return;
	  }

	  var name = $("#eidCommentUserName");
	  var subject = $("#eidCommentSubject");
	  var comment = $("#eidCommentBody");
	  var email = $("#eidCommentEmail");
	  var notify = $("#eidCommentNotify");
	  var type = $("#eidCommentType");
	  var method = "Comments/Add";
	  var datasetId = "@Model.DatasetId";
	  var datasetName = "@Html.Raw(Model.DatasetName)";
	  var parentType = "@Model.ParentType";
	  var container = "@Model.Container";	  

	  var data = {
		name: name.val(),
		subject: subject.val(),
		comment: comment.val(),
		email: email.val(),
		type: type.val(),
		notify: notify[0].checked,
		datasetId: datasetId,
		datasetName: datasetName,
		parentType: parentType,
		container: container,
		captchaChallenge: Recaptcha.get_challenge(),
		captchaResponse: Recaptcha.get_response()
	  }

	  if (!data.subject || !data.comment || !data.name) {
		  $("#eidCaptchaMessage").text("@SharedResources.Comments.PleaseEnterYourNameAndComment");
		return;
	  }

	var isEmailRequired = data.notify || (data.type == "@SharedResources.Comments.GeneralCommentReplyRequired");

	  if (isEmailRequired && !data.email) {
		  $("#eidCaptchaMessage").text("@SharedResources.Comments.PleaseEnterYourEmail");
		return;
	  }

	  var errorHandler = function(error, status, xhr) {
		  if (confirm("@SharedResources.Comments.ErrorOccuredDebug")) {
		  debugger;
		}
	  }

	  var dataHandler = function(data) {
		Recaptcha.reload();
		if (data == "") {
			$("#eidCaptchaMessage").text("@SharedResources.Comments.PleaseTryAgain");
		  return;
		}
	  $("#eidCaptchaMessage").text("@SharedResources.Comments.YourCommentWasAddedSuccessfully");

		var container = $("#eidComments");
		var item = q.div("item").appendTo(container);
		item.html(data);
		var odd = container.find("div.item").length % 2;
		item.addClass(odd ? "co" : "ce");

		subject.val('');
		comment.val('');
		type.val('');
	  }

	  var options = {
		url: Comments.vpath + method,
		cache: false,
		data: data,
		dataType: "html",
		error: errorHandler,
		success: dataHandler,
		type: "POST"
	  };
	  $.ajax(options);
	  return false; // don't really want to submit
	}

	function DeleteComment(commentid) {
		var globVPath = '@this.ResolveUrl("~/")';
		var result;
		$.ajax(
			{
				type: "POST",
				async: false,
				url: globVPath + "Comments/DeleteComment/?id=" + commentid,
				data: result,
				dataType: "json"
			});
		return false;
	}
	
</script>


<style type="text/css">
	.style1
	{
		height: 40px;
	}
</style>


<div class="comments">
	<table cellpadding="0" cellspacing="0" width="100%">
		<tr>
			<td>
				<div class="bar">
					<div class="header">
					  @SharedResources.Comments.CommentsString 
					</div>
					<div class="clear">
					</div>
				</div>
			</td>
		</tr>
	</table>
<div class="list" id="eidComments">
	@{
		var comments = this.Model.Comments.GetEnumerator();
		if (comments.MoveNext())
		{
			bool odd = true;
			do
			{
				var comment = comments.Current;

				if (odd == true)
				{
		<text><div class="item co"></text>
				}
				else
				{
		<text><div class="item ce"></text>
				}               
					
		@Html.Partial("comment", comment) 
		@Html.Raw("</div")	
   odd = !odd;
			} while (comments.MoveNext());
		}
		else
		{ }
	 } 
</div>

<form id="commentForm" method="post">
<div class="bar"> @SharedResources.Comments.NewComment </div>
<table class="form" cellpadding="0" cellspacing="2" border="0">

	<tr class="field">
		<td class="label"> @SharedResources.Comments.Name <span class="field-validation-error">*</span></td>
		<td class="value">
			<input type="text" id="eidCommentUserName" name="CommentUserName" />
			
		</td>
	</tr>
	
	<tr class="field" id="eidCommentEmailBar">
		<td class="label"> @SharedResources.Comments.Email <span id="eidEmailStarSpan" class="field-validation-error">*</span></td>
		<td class="value">
			<input type="text" id="eidCommentEmail" name="CommentEmail"/>
			<div style="font-size:7pt; color:gray; "> @SharedResources.Comments.WillNotBeShownToPublic </div>
		</td>
	</tr>

	<tr class="field">
		<td class="label"> @SharedResources.Comments.Subject <span class="field-validation-error">*</span></td>
		<td class="value">
			<input type="text" id="eidCommentSubject" name="CommentSubject"/>
		</td>
	</tr>
	
	<tr class="field">
		<td class="label"> @SharedResources.Comments.Comment <span class="field-validation-error">*</span></td>
		<td class="value">
			<textarea cols="40" rows="10" id="eidCommentBody" name="CommentBody" ></textarea>
		</td>
	</tr>
	
	<tr class="field">
		<td class="label"> @SharedResources.Comments.MarkAs </td>
		<td class="value">
			<select id="eidCommentType" onchange="javascript:onEmailChange()">
			@{ foreach (var type in this.Model.CommentTypes) { 
				<option value="@type">@type</option>
			 } }
			</select>
		</td>
	</tr>
	
	<tr class="field">
		<td class="label"><div style="padding: 4px 0px;"> @SharedResources.Comments.Subscription </div></td>
		<td class="value">
		<a href="@link"> @SharedResources.Comments.RssAtomFeed </a> <a href="@link"><img src="/Content/Images/rss.gif" alt="Atom feed" style="vertical-align:middle;padding: 4px 0px;"/></a>
		</td>
	</tr>
	
	<tr class="field">
		<td class="label">&nbsp;</td>
		<td class="value">
			<input type="checkbox" class="checkbox" id="eidCommentNotify" onclick="javascript:onEmailChange()"/>
			<label for="eidCommentNotify"> @SharedResources.Comments.NotifyMeAboutRepliesByEmail </label>
		</td>
	</tr>

	<tr class="field">
		<td class="label"> @SharedResources.Comments.EnterText <span class="field-validation-error">*</span></td>
		<td class="value">
			<table cellpadding="0" cellspacing="0">
			<tr>
			<td>
				<div id="eidCommentsRecaptcha"></div>			
			</td>
			<td valign="top">
				
			</td>
			</tr>
			</table>
		</td>
	</tr>
	
	<tr>
		<td class="value" colspan="2">
			<div id="eidCaptchaMessage"></div>
		</td>
	</tr>
	<tr>
		<td  colspan="2" align="right" class="buttons">@Html.Raw(Html.TextInputButton(this, SharedResources.Comments.PostComment, "return !!Comments.AddComment();"))</td>
	</tr>
</table>	
</form>
<script type="text/javascript">
	function onEmailChange() {        
		var emailStar = $("#eidEmailStarSpan");
		var type = $("#eidCommentType");
		var notify = $("#eidCommentNotify");
		if ((type[0].selectedIndex == 1)||(notify[0].checked)) {
			emailStar.show();
		} else {
			emailStar.hide();
		}
	}
	onEmailChange();	
</script>

</div>
